const path = require("path");

const HtmlWebPackPlugin = require("html-webpack-plugin");

const webpack = require("webpack");

module.exports = {
  mode: "production",

  entry: "./index.js", // 入口文件
  output: {
    path: path.resolve(__dirname, "dist"), // 定义输出目录
    filename: "index.js", // 定义输出文件名称
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/, // 匹配.js文件
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
        },
      },
    ],
  },
  devServer: {
    hot: true, // 热替换
    contentBase: path.join(__dirname, "dist"), // server文件的根目录
    compress: true, // 开启gzip
    port: 8081, // 端口
  },
  node: {
    fs: "empty",
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(), // HMR允许在运行时更新各种模块，而无需进行完全刷新
    new HtmlWebPackPlugin({
      template: "./index.html",
      filename: path.resolve(__dirname, "dist/index.html"),
    }),
  ],
};
